<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.prime.com.tr/ui">
<h:head>
</h:head>
<h:body>

<ui:composition template="/templates/Plantilla.xhtml">

 <ui:define name="content">			
  <h:form class="form" id="form">
	<p:growl id="growl" sticky="true" showDetail="true"/>  
  
    <p:wizard widgetVar="wiz"  
            flowListener="#{sujetoResidencialCreate.onFlowProcess}">  
      
        <p:tab id="personal" title="Personal">  
  
            <p:panel header="Datos del Sujeto">  
              
                <h:messages errorClass="error"/>  
                  
                <h:panelGrid columns="2" columnClasses="label, value" styleClass="grid">
               		<h:outputText id="lblTipoCliente" value="Tipo de Cliente: *"/>
			        <h:selectOneMenu id="inputTipoCliente" value="#{sujetoResidencialCreate.sujeto.tipoCliente.tipoClienteId}">  
		                <f:selectItems value="#{selectOneMany.tiposDeClientes()}" var="tipoCliente" 
							itemLabel="#{tipoCliente.nombre}" 
							itemValue="#{tipoCliente.tipoClienteId}"></f:selectItems>
		            </h:selectOneMenu>	
                 
                    <h:outputText id="lblNombre" value="Nombre: *"/>
					<p:inputText id="inputNombre" value="#{sujetoResidencialCreate.sujeto.nombre}" required="true"/>
					
					<h:outputText id="lblApellido" value="Apellido: *"/>
					<p:inputText id="inputApellido" required="true" value="#{sujetoResidencialCreate.sujeto.apellido}"/>
					
					<h:outputText id="lblApodo" value="Apodo/Alias:"/>
					<p:inputText id="inputApodo" value="#{sujetoResidencialCreate.sujeto.alias}"/>
						
                </h:panelGrid>  
            </p:panel>  
        </p:tab>  
              
        <p:tab id="address" title="Domicilio">  
            <p:panel header="Datos del Domicilio">  
              
                <h:messages errorClass="error"/>  
                  
                <h:panelGrid>  
                    <h:outputText value="Calle: *" />  
                    <p:inputText value="#{sujetoResidencialCreate.sucursal.calle}" required="true"/>  
                    <br/>  
                    <h:outputText value="Nº: *" />  
                    <p:inputText value="#{sujetoResidencialCreate.sucursal.numero}" required = "true"/>
                    <br/>
                    <h:outputText id="lblPiso" value="Piso:"/>
					<p:inputText id="inputPiso" value = "#{sujetoResidencialCreate.sucursal.piso}"/>
					<h:outputText id="lblDpto" value="Dpto:"/>
					<p:inputText id="inputDpto" value = "#{sujetoResidencialCreate.sucursal.departamento}"/>
					<h:outputText id="lblMza" value="Mza:"/>
					<p:inputText id="inputMza" value = "#{sujetoResidencialCreate.sucursal.manzana}"/>					
					<h:outputText id="lblLte" value="Lote:"/>
					<p:inputText id="inputLte" value = "#{sujetoResidencialCreate.sucursal.lote}"/>
					<br/>
					<h:outputText id="lblObservacion" value="Observacion:"/>
					<p:inputText id="inputObservacion" value = "#{sujetoResidencialCreate.sucursal.observacion}"/>
                      
                </h:panelGrid>  
            </p:panel>  
        </p:tab>  
              
        <p:tab id="contact" title="Contacto">  
            <p:panel header="Información de Contacto">  
                <h:messages errorClass="error"/>                
                <h:panelGrid>  
                    <h:outputText id="lblTelefono" value="Telefono:"/>
					<p:inputText id="inputTelefono" value="#{sujetoResidencialCreate.sujeto.telefonoFijo}"/>
					<h:outputText id="lblInterno" value="Interno:"/>
					<p:inputText id="inputInterno" value="#{sujetoResidencialCreate.sujeto.interno}"/>
					<br/>
					<h:outputText id="lblCelular" value="Celular:"/>
					<p:inputText id="inputCelular" value="#{sujetoResidencialCreate.sujeto.telefonoMovil}"/>
					<br/>
					<h:outputText id="lblEmail" value="Email:"/>
					<p:inputText id="inputEmail" value="#{sujetoResidencialCreate.sujeto.email}"/>
                </h:panelGrid>  
            </p:panel>  
        </p:tab>  
        
        <p:tab id="visita" title="Visita">
        	<p:panel header = "Reparto y Frecuencia de Visita">
        		<h:outputText id="lblReparto" value="Reparto: *"/>
				<h:selectOneMenu id="inputReparto" value="#{sujetoResidencialCreate.visita.reparto.repartoId}" >
					<f:selectItems value="#{selectOneMany.getRepartos()}" var="reparto" 
						itemLabel="#{reparto.nombre}" 
						itemValue="#{reparto.repartoId}"></f:selectItems>
				</h:selectOneMenu>				
				<br/>
				<h:outputText id="lblVisita" value="Dia de visita: *"/>
				<h:selectManyCheckbox value="#{sujetoResidencialCreate.favNumber3}">
 					<f:selectItems value="#{sujetoResidencialCreate.favNumber3Value}" />
 				</h:selectManyCheckbox>
        	</p:panel>
        </p:tab>
        
        <p:tab id="producto" title="Producto">
        	<p:panel>
 			<p:dataTable id="tblProductos"	value="#{sujetoResidencialCreate.productoDataModel}"
                          var="p" paginator="true" rows="10"
                          selection="#{sujetoResidencialCreate.productosSeleccionados}"
                          rowKey="#{p.productoId}">  			
		  			<f:facet name="header">Productos Disponibles</f:facet>
					
					<p:column selectionMode="multiple">
					</p:column>
					
		  			<p:column sortBy="#{p.nombre}" filterBy="#{p.nombre}">
		  				<f:facet name="header">Nombre</f:facet>
		  				#{p.nombre}
		  			</p:column>
		
		  			<p:column>
		  				<f:facet name="header">Precio</f:facet>
		  				#{p.precio}
		  			</p:column>
		  			
		  			<p:column sortBy="#{p.tipoProducto.nombre}">
		  				<f:facet name="header">Tipo</f:facet>
		  				#{p.tipoProducto.nombre}
		  			</p:column>
		  			
		  			<f:facet name="footer">  
			            <p:commandButton id="multiViewButton" value="View" icon="ui-icon-search"  
			                             update=":form:displayMulti" oncomplete="multiCarDialog.show()"
			                             action="#{sujetoResidencialCreate.save(sujetoResidencialCreate.productosSeleccionados)}"/>  
			        </f:facet>		  						    					  			
				</p:dataTable>
				<p:dialog id="multiDialog" header="Pack Detail" widgetVar="multiCarDialog"  
			              height="300" showEffect="fade" hideEffect="explode">  
			  
			        <p:dataList id="displayMulti"  
			                value="#{sujetoResidencialCreate.productosSeleccionados}" var="producto">  
			            Model: #{producto.nombre}  
			        </p:dataList>  
			  
			    </p:dialog>  				
        	</p:panel>
        </p:tab>
        
        <p:tab id="pack" title="Pack">
        	<p:panel header="Equipos de Frio Calor Disponibles">
        	
        	</p:panel>
        	
        	<p:panel header="Pack disponibles">
        		<h:outputText id="lblNombrePack" value="Pack: *"/>
        		<h:selectOneMenu id="inputPack" value="#{sujetoResidencialCreate.visita.reparto.repartoId}" >
					<f:selectItems value="#{selectOneMany.getPacks()}" var="pack" 
						itemLabel="#{pack.nombre}" 
						itemValue="#{pack.packId}"></f:selectItems>
				</h:selectOneMenu>
				
        		<h:outputText id="lblCantidadPack" value="Cantidad: *"/>
        		
        	</p:panel>
        </p:tab>      
        <p:tab id="confirm" title="Confirmación">
            <p:panel header="Confirmar Alta">  
              
                <h:panelGrid id="confirmation" columns="6">  

                </h:panelGrid>  
                  
                <p:commandButton value="Guardar" actionListener="#{sujetoResidencialCreate.save(sujetoResidencialCreate.productosSeleccionados)}"
                update="tblProductos,producto,form" ajax="false"/>
                <p:commandButton value="Cancelar"/>  
              
            </p:panel>  
        </p:tab>  
          
    </p:wizard>  	
			
	    		
  </h:form>        	        	        	        
 </ui:define>
	
</ui:composition>
	
	
</h:body>
</html>